<template>
    <div style="min-height: 800px;">
<!--        allResultArr：{{allResultArr}}-->
<!--        <hr/>-->
        <h1>1.用{{a}}、{{b}}、{{c}}、{{d}}编写几道和相同的两位数加两位数的算式</h1>
        <el-form label-width="200px">
            <el-form-item label="数字1：">
                <el-input-number v-model="a" :min="1" :max="9" @change="calcSingle"></el-input-number>
            </el-form-item>
            <el-form-item label="数字2：">
                <el-input-number v-model="b" :min="1" :max="9" @change="calcSingle"></el-input-number>
            </el-form-item>
            <el-form-item label="数字3：">
                <el-input-number v-model="c" :min="1" :max="9" @change="calcSingle"></el-input-number>
            </el-form-item>
            <el-form-item label="数字4：">
                <el-input-number v-model="d" :min="1" :max="9" @change="calcSingle"></el-input-number>
            </el-form-item>
            <el-form-item label="隐藏小于等于2组的组合：">
                <el-checkbox v-model="hidden2" @change="calcSingle"></el-checkbox>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="calcAll" :loading="loading">遍历所有数字组合计算</el-button>
            </el-form-item>
        </el-form>
        <div v-for="(c, cIndex) in allResultArr" :key="cIndex">
            <div style="font-size:20px;padding-left:5px;">
                <div>{{cIndex + 1}}、{{c.queryCondition.join('，')}}：</div>
                <div style="padding-left: 30px;">
                    <div v-for="(r, index) in c.resultArr" :key="cIndex + '_' + index">
    <!--                    <div>{{r}}</div>-->
                        <hr v-if="index != 0 && r.sum != c.resultArr[index - 1].sum" :key="cIndex + '_hr_' + index" />
                        <div>{{r.x}} + {{r.y}} = {{r.sum}}</div>
                    </div>
                    <div v-if="c.resultArr.length == 0">无</div>
                </div>
            </div>
        </div>
<!--        <el-table :data="resultArr" >-->
<!--            <el-table-column-->
<!--                    type="index"-->
<!--                    width="50">-->
<!--            </el-table-column>-->
<!--            <el-table-column prop="x" label="因子1" width="120px"></el-table-column>-->
<!--            <el-table-column prop="y" label="因子2" width="120px"></el-table-column>-->
<!--            <el-table-column prop="sum" label="和" width="120px"></el-table-column>-->
<!--        </el-table>-->
    </div>
</template>

<script>
    import util from '../util/util'
    export default {
        name: "permute1",
        data() {
            return {
                allResultArr: [],
                a: 3,
                b: 5,
                c: 7,
                d: 9,
                hidden2: true,
                loading: false,
            }
        },
        methods: {
            calcSingle() {
                this.allResultArr = [this.calc(this.a, this.b, this.c, this.d)]
            },
            calcAll() {
                this.loading = true
                this.allResultArr = []

                setTimeout(() => {
                    let allResultArr = []
                    let allSourceNumberArr = util.combo([1, 2, 3, 4, 5, 6, 7, 8, 9], 4)
                    allSourceNumberArr.forEach(sourceArr => {
                        let result = this.calc(sourceArr[0],sourceArr[1], sourceArr[2], sourceArr[3])
                        if(result.resultArr.length > 0) {
                            allResultArr.push(result)
                        }
                    })

                    this.allResultArr = allResultArr
                    this.loading = false
                }, 200);
            },
            calc(a, b, c, d) {
                let result = util.permutator([a, b, c, d])
                let resultArr = []
                let existedSet = new Set()
                result.forEach(r => {
                    let x = parseInt(r[0]) * 10 + parseInt(r[1])
                    let y = parseInt(r[2]) * 10 + parseInt(r[3])
                    let sum = x + y
                    if(!existedSet.has(x + "_" + y) && !existedSet.has(y + "_" + x)) {
                        resultArr.push({x: x, y: y, sum: sum})
                        existedSet.add(x + "_" + y)
                    }
                })
                resultArr.sort((a, b) => {
                    return a.sum - b.sum
                })
                resultArr = this.processResult(resultArr)
                return {
                    queryCondition:[a, b, c, d],
                    resultArr: resultArr
                }
            },
            processResult(resultArr) {
                let resultArr2 = []
                let sumCountMap = {}
                resultArr.forEach(r => {
                    if(!sumCountMap[r.sum]) {
                        sumCountMap[r.sum] = 1
                    } else {
                        sumCountMap[r.sum] = sumCountMap[r.sum] + 1
                    }
                })

                resultArr.forEach(r => {
                    r.sumCount = sumCountMap[r.sum]
                })

                resultArr.forEach(r => {
                    let isHidden = false
                    if(this.hidden2 && r.sumCount <= 2) {
                        isHidden = true
                    }
                    if(!isHidden) {
                        resultArr2.push(r)
                    }
                })
                return resultArr2
            }
        },
        mounted() {
            this.calcSingle()
        }
    }
</script>

<style scoped>
    .my-input {
        /*width: 100px;*/
    }
</style>
